<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,
                                   user-scalable=no">
    <title>作业B</title>
    <link rel="stylesheet" href="css/index_img_border.css">
    <link rel="stylesheet" href="css/index_div.css">
    <style>
        img[alt='one']{
            border: 5px dashed #e9c981;
        }
        @media screen and (max-width: 960px) {
            img[alt='one']{
                border:5px dashed lightgreen;
            }
            img[alt='two']{
                border:5px dashed black;
            }
        }
    </style>
</head>

<body>
<div style="width:150px;height: 80px;color: #3281c5;padding-left: 5px">
<h2>感觉中二了</h2>
</div>
<div style="clear: left">
    <img src="img/qiyana_panfa1.jpg" alt="two">
    <p>崩坏3 那个傻傻的女孩——琪亚娜</p>
</div>
<div>
    <img src="img/yayi1.jpg" alt="one">
     <p>崩坏3 一直守护琪亚娜——芽衣</p>
</div>
<div>
    <img src="img/buluoniya_danfa1.jpg" alt="two">
     <p>崩坏3 其实很善良的孩子——布洛尼亚</p>
</div>
<div>
    <img src="img/delisha_rabbit.jpg" alt="one">
     <p>崩坏3 魔法少女terrir——德莉莎</p>
</div>
<div>
    <img src="img/delisha_cat.jpg" alt="two">
     <p>崩坏3 总是长不大的学园长——德莉莎</p>
</div>
</body>
</html>